﻿<!doctype html>
<html lang="en">

<head>

    <!--====== Required meta tags ======-->
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!--====== Title ======-->
    <title>主页</title>

    <!--====== Bootstrap css ======-->
    <link rel="stylesheet" href="/static/index/css/bootstrap.min.css">

    <!--====== Pe Icon 7 Stroke css ======-->
    <link rel="stylesheet" href="/static/index/css/Pe-icon-7-stroke.css">

    <!--====== Ion Icons css ======-->
    <link rel="stylesheet" href="/static/index/css/ionicons.min.css">

    <!--====== Magnific Popup css ======-->
    <link rel="stylesheet" href="/static/index/css/magnific-popup.css">

    <!--====== Slick css ======-->
    <link rel="stylesheet" href="/static/index/css/slick.css">

    <!--====== Animate css ======-->
    <link rel="stylesheet" href="/static/index/css/animate.min.css">

    <!--====== Nice Select css ======-->
    <link rel="stylesheet" href="/static/index/css/nice-select.css">

    <!--====== Default css ======-->
    <link rel="stylesheet" href="/static/index/css/default.css">

    <!--====== Style css ======-->
    <link rel="stylesheet" href="/static/index/css/style.css">

    <style>

        .navigation .navbar .navbar-icon ul li:last-child a::before {
            position: absolute;
            content: "{{ user.car | count }}";
            height: 18px;
            width: 18px;
            text-align: center;
            line-height: 18px;
            border-radius: 50%;
            color: #222222;
            background: #fff;
            top: -7px;
            right: -15px;
            font-size: 12px;
            font-weight: 500;
        }
    </style>

</head>

<body>

<!--====== PRELOADER  PART START ======-->

<div id="preloader">
    <div id="loader">
        <span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>
    </div>
</div>

<!--====== PRELOADER  PART ENDS ======-->

<!--====== SEARCH PART START ======-->

<div class="search-box">
    <div class="search-header">
        <div class="container mt-60">
            <div class="row">
                <div class="col-6">
                    <h5 class="search-title">Search</h5> <!-- search title -->
                </div>
                <div class="col-6">
                    <div class="search-close text-right">
                        <button class="search-close-btn">Close <span></span><span></span></button>
                    </div> <!-- search close -->
                </div>
            </div> <!-- row -->
        </div> <!-- container -->
    </div> <!-- search header -->
    <div class="search-body">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="search-form">
                        <form action="#">
                            <input type="text" placeholder="Search for Products">
                            <button><i class="flaticon-search"></i></button>
                        </form>
                    </div>
                </div>
            </div> <!-- row -->
        </div> <!-- container -->
    </div> <!-- search body -->
</div>

<!--====== SEARCH PART ENDS ======-->

<!--====== SHOPPING CART PART START ======-->

<div class="shopping-cart-wrapper">
    <div class="shopping-cart-canvas">
        <div class="shopping_cart">
            <div class="shopping_cart-top-bar d-flex justify-content-between">
                <h6>Shopping Cart</h6>
                <button class="shopping-cart-close">
                    <i class="ion ion-md-add"></i>
                </button>
            </div><!-- shopping cart top bar -->
            <div class="shopping_cart-list-items mt-30">
                <ul>
                    {% if user.car %}
                        {% for foo in user.car %}
                            <li>
                                <div class="single-shopping-cart media">
{#                                    <div class="cart-image">#}
{#                                        <img src="{{ foo.commod_photos[0].Photo_url }}" alt="Cart">#}
{#                                    </div>#}
                                    <div class="cart-content media-body pl-15">
                                        <h6><a href="product-details.html?comd_id={{ foo.id }}">{{ foo.com_name }}</a>
                                        </h6>
                                       <span class="quality">数量: {{ foo.id | get_count_and_prices }}</span>
                                        <span class="price">$ {{ foo.com_price }} x {{ foo.id | get_count_and_prices }}</span>
                                        <span class="price-close">$205.00</span>
                                        <a class="remove" href="#" style="content: {{ user.car | count }}"><i
                                                class="fal fa-times"></i></a>

                                    </div>
                                </div> <!-- single shopping cart -->
                            </li>
                        {% endfor %}
                    {% else %}
                        <div>你还未登录，点击<a href="login.html">登录</a></div>
                    {% endif %}



                    {#                        <li>#}
                    {#                            <div class="single-shopping-cart media">#}
                    {#                                <div class="cart-image">#}
                    {#                                    <img src="/static/images/cart-2.jpg" alt="Cart">#}
                    {#                                </div>#}
                    {#                                <div class="cart-content media-body pl-15">#}
                    {#                                    <h6><a href="#">Grape</a></h6>#}
                    {#                                    <span class="quality">QTY: 01</span>#}
                    {#                                    <span class="price-discount">$205.00</span>#}
                    {#                                    <span class="price-close">$205.00</span>#}
                    {#                                    <a class="remove" href="#"><i class="fal fa-times"></i></a>#}
                    {#                                </div>#}
                    {#                            </div> <!-- single shopping cart -->#}
                    {#                        </li>#}
                </ul>
            </div> <!-- shopping_cart list items -->
            <div class="shopping_cart-btn">
                <div class="total pt-35 d-flex justify-content-between">
                    <h5>小计:</h5>
                    {% if user.car %}
                    <p>${{ user.car | total_price("") }}</p>
                    {% endif %}
                </div>
                <div class="cart-btn pt-25">
                    <a class="main-btn" href="com_car.html">查看购物车</a>
                    <a class="main-btn main-btn-2" href="checkout.html">立即结算</a>
                </div>
            </div>
        </div> <!-- shopping_cart -->
    </div>
    <div class="overlay"></div>
</div>

<!--====== SHOPPING CART PART ENDS ======-->

<!--====== HEADER  PART START ======-->

<header class="header-area">
    <div class="navigation fixed-top">
        <div class="container-fluid pl-60 pr-60">
            <div class="row">
                <div class="col-lg-12">
                    <nav class="navbar navbar-expand-lg">
                        <a class="navbar-brand" href="index.html">
                            <img src="/static/index/images/logo.png" alt="Logo">
                        </a> <!-- Logo -->

                        <button class="navbar-toggler" type="button" data-toggle="collapse"
                                data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
                                aria-expanded="false" aria-label="Toggle navigation">
                            <span class="toggler-icon"></span>
                            <span class="toggler-icon"></span>
                            <span class="toggler-icon"></span>
                        </button> <!-- navbar-toggler -->

                        <div class="collapse navbar-collapse sub-menu-bar" id="navbarSupportedContent">
                            <ul class="navbar-nav m-auto">
                                <li class="nav-item"><a href="index.html">主页</a></li>
                                <li class="nav-item"><a href="product-grid.html">全部商品</a></li>
                                <li class="nav-item"><a class="page-scroll" href="#">最新活动</a></li>
                                <li class="nav-item"><a class="page-scroll" href="#">会员俱乐部</a></li>

                                {% if user %}
                                 <li class="nav-item"><a class="page-scroll" href="order.html">{{ user.nick_name }}的订单</a></li>
                                {% endif %}

                            </ul>
                        </div> <!-- navbar collapse -->
                        <div class="navbar-icon d-none d-sm-block">
                            <ul>
                                {% if not user %}
                                    <li><a class="" href="login.html">登录</a></li>
                                    <li><a class="" href="register.html">注册</a></li>
                                {% else %}
                                    <li><a class="" href="user.html"><i
                                            class="pe-7s-user"></i>欢迎您,{{ user.nick_name }}<i class=""></i></a></li>

                                    <li><a href="/logout">退出</a></li>
                                {% endif %}
                                <li><a class="search-open" href="#"><i class="pe-7s-search"></i></a></li>
                                <li><a class="shopping-cart-open" href="#"><i class="pe-7s-cart"></i></a></li>
                            </ul>
                        </div>
                    </nav> <!-- navbar -->
                </div>
            </div> <!-- row -->
        </div> <!-- container -->
    </div> <!-- navigation -->
</header>

<!--====== HEADER  PART ENDS ======-->

<!--====== BANNER  PART START ======-->

<div class="banner-active">
    <div class="banner-area d-flex align-items-center bg_cover"
         style="background-image: url(/static/index/images/banner-bg.jpg);">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-6">
                    <div class="banner-content text-center">
                        <h1 data-animation="fadeInUp" data-delay="0.5s" class="title">吃新鲜</h1>
                        <a data-animation="fadeInUp" data-delay="1.2s" class="main-btn" href="product-grid.html">去购物</a>
                    </div>
                </div>
            </div> <!-- row -->
        </div> <!-- container -->
        <div class="banner-shape">
            <img src="/static/index/images/banner-shape.png" alt="shape">
        </div>
    </div> <!-- banner area -->
    <div class="banner-area d-flex align-items-center bg_cover"
         style="background-image: url(/static/index/images/banner-bg-2.jpg);">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-6">
                    <div class="banner-content text-center">
                        <h1 data-animation="fadeInUp" data-delay="0.5s" class="title">Eat Fresh</h1>
                        <a data-animation="fadeInUp" data-delay="1.2s" class="main-btn" href="product-grid.html">SHOP
                            Now</a>
                    </div>
                </div>
            </div> <!-- row -->
        </div> <!-- container -->
        <div class="banner-shape">
            <img src="/static/index/images/banner-shape.png" alt="shape">
        </div>
    </div> <!-- banner area -->
    <div class="banner-area d-flex align-items-center bg_cover"
         style="background-image: url(/static/index/images/banner-bg-3.jpg);">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-6">
                    <div class="banner-content text-center">
                        <h1 data-animation="fadeInUp" data-delay="0.5s" class="title">Eat Fresh</h1>
                        <a data-animation="fadeInUp" data-delay="1.2s" class="main-btn" href="product-grid.html">SHOP
                            Now</a>
                    </div>
                </div>
            </div> <!-- row -->
        </div> <!-- container -->
        <div class="banner-shape">
            <img src="/static/index/images/banner-shape.png" alt="shape">
        </div>
    </div> <!-- banner area -->
</div>

<!--====== BANNER  PART ENDS ======-->

<!--====== SUB PRODUCT PART START ======-->

<div class="sub-product-area">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div class="sub-product d-flex justify-content-between">
                    <div class="sub-product-item text-center mt-30">
                        <a href="product-details.html"><img src="/static/index/images/sub-1.jpg" alt="Eggs"><br>
                            <span>鸡蛋</span></a>
                    </div> <!-- sub product item -->
                    <div class="sub-product-item text-center mt-60">
                        <img src="/static/index/images/sub-2.jpg" alt="Fruit"><br>
                        <a href="product-details.html"><span>水果</span></a>
                    </div> <!-- sub product item -->
                    <div class="sub-product-item text-center mt-30">
                        <a href="product-details.html"><img src="/static/index/images/sub-3.jpg" alt="Vegetables"><br>
                            <span>蔬菜</span></a>
                    </div> <!-- sub product item -->
                    <div class="sub-product-item text-center mt-60">
                        <a href="product-details.html"><img src="/static/index/images/sub-4.jpg" alt="Meat"><br>
                            <span>肉类</span></a>
                    </div> <!-- sub product item -->
                    <div class="sub-product-item text-center mt-30">
                        <a href="product-details.html"><img src="/static/index/images/sub-5.jpg" alt="Dairy"><br>
                            <span>奶制品</span></a>
                    </div> <!-- sub product item -->
                </div>
            </div> <!-- row -->
        </div> <!-- container -->
    </div>
</div>

<!--====== SUB PRODUCT PART ENDS ======-->

<!--====== PRODUCT  PART START ======-->

<section class="product-area area-padding">
    <div class="container">
        <div class="row">

            {% for photo in photos %}
                <div class="col-lg-4 col-md-4 col-sm-6">
                    <div class="single-product mt-30">
                        <a href="product-details.html?commod_id={{ photo.commods.id }}">
                            <img src="{{ photo.Photo_url }}" alt="product">

                            <h6 class="title">{{ photo.commods.com_name }}</h6>
                        </a>
                        <ul>
                            <li>${{ photo.commods.com_price }}</li>
                        </ul>
                    </div> <!-- single product -->
                </div>
            {% endfor %}


            {#                <div class="col-lg-4 col-md-4 col-sm-6">#}
            {#                    <div class="single-product mt-30">#}
            {#                        <img src="/static/images/product-2.jpg" alt="product">#}
            {#                        <a href="product-details.html">#}
            {#                            <h6 class="title">Cabbage</h6>#}
            {#                        </a>#}
            {#                        <span>Sale</span>#}
            {#                        <ul>#}
            {#                            <li>$45.00</li>#}
            {#                            <li class="item-2"> $70.00</li>#}
            {#                        </ul>#}
            {#                    </div> <!-- single product -->#}
            {#                </div>#}

        </div> <!-- row -->
    </div> <!-- container -->
</section>

<!--====== PRODUCT  PART ENDS ======-->

<!--====== PLAY PART START ======-->

<section class="play-area">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div class="play-item">
                    <div class="play-title pb-25">
                        <h3 class="title">100% Natural From The Farm</h3>
                        <p>It has survived not only five centuries, but also the leap into electronic typesetting,
                            remaining essentially unchanged</p>
                    </div>
                    <div class="play-thumb mt-30">
                        <img src="/static/index/images/play-thumb.png" alt="">
                        <a class="video-popup"
                           href="https://vd2.bdstatic.com/mda-jifg4qvywq9emg4f/sc/mda-jifg4qvywq9emg4f.mp4?auth_key=1603357745-0-0-1993f474e3232d41a43bbef054c19d33&bcevod_channel=searchbox_feed&pd=1&pt=3&abtest=8790_7"><i
                                class="icon ion-md-play"></i></a>
                    </div>
                </div> <!-- play item -->
            </div>
        </div> <!-- row -->
    </div> <!-- container -->
</section>

<!--====== PLAY PART ENDS ======-->

<!--====== BRAND PART START ======-->

<div class="brand-area">
    <div class="container">
        <div class="row brand-active">
            <div class="col-lg-3">
                <div class="brand-item">
                    <img src="/static/index/images/brand-1.png" alt="">
                </div> <!-- brand item -->
            </div>
            <div class="col-lg-3">
                <div class="brand-item">
                    <img src="/static/index/images/brand-2.png" alt="">
                </div> <!-- brand item -->
            </div>
            <div class="col-lg-3">
                <div class="brand-item">
                    <img src="/static/index/images/brand-3.png" alt="">
                </div> <!-- brand item -->
            </div>
            <div class="col-lg-3">
                <div class="brand-item">
                    <img src="/static/index/images/brand-4.png" alt="">
                </div> <!-- brand item -->
            </div>
            <div class="col-lg-3">
                <div class="brand-item">
                    <img src="/static/index/images/brand-5.png" alt="">
                </div> <!-- brand item -->
            </div>
            <div class="col-lg-3">
                <div class="brand-item">
                    <img src="/static/index/images/brand-5.png" alt="">
                </div> <!-- brand item -->
            </div>
        </div> <!-- row -->
    </div> <!-- container -->
</div>

<!--====== BRAND PART ENDS ======-->

<!--====== SELLER PART START ======-->

<section class="seller-area pt-90 pb-55">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div class="section-title text-center">
                    <a href="#">
                        <h3 class="title">大家都在买</h3>
                    </a>
                </div> <!-- section title -->
            </div>
        </div>
        <div class="row seller-active">

            {% for photo in photos %}
                <div class="col-lg-3">
                    <div class="single-seller mt-30">
                        <a href="product-details.html?commod_id={{ photo.commods.id }}">
                            <img src="{{ photo.Photo_url }}" alt="">

                            <h5 class="title">{{ photo.commods.com_name }}</h5>
                        </a>
                        <ul>
                            <li>${{ photo.commods.com_price }}</li>
                        </ul>
                    </div> <!-- single seller -->
                </div>

            {% endfor %}

        </div> <!-- row -->
    </div> <!-- container -->
</section>

<!--====== SELLER PART ENDS ======-->

<!--====== DISCOUNT PART START ======-->

<section class="discount-area pb-90">
    <div class="container-fluid p-0">
        <div class="row">
            <div class="col-lg-6">
                <div class="discount-item bg_cover mt-30"
                     style="background-image: url(/static/index/images/discount-bg-1.jpg);">
                    <span>100% natural </span>
                    <h2 class="title">From the farm</h2>
                </div>
            </div>
            <div class="col-lg-6">
                <div class="discount-item bg_cover mt-30"
                     style="background-image: url(/static/index/images/discount-bg-2.jpg);">
                    <span>Sale off</span>
                    <h2 class="title">Extra 20% Off </h2>
                    <a class="main-btn main-btn-2" href="com_car.html">Shop Now</a>
                </div>
            </div>
        </div> <!-- row -->
    </div> <!-- container fluid -->
</section>

<!--====== DISCOUNT PART ENDS ======-->

<!--====== CUSTOMER PART START ======-->

<div class="customer-area">
    <div class="container">
        <div class="row customer-active">
            <div class="col-lg-6">
                <div class="customer-item">
                    <img src="/static/index/images/customer-1.png" alt="customer">
                    <span><b>Adam</b> / Designer</span>
                    <p>“ Lorem ipsum dolor sit amet, consectetur elit, sed do eiusmod tempor incididunt ut labore et
                        dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
                        aliquip ex ea comodo conequat ”</p>
                </div> <!-- customer item -->
            </div>
            <div class="col-lg-6">
                <div class="customer-item">
                    <img src="/static/index/images/customer-2.png" alt="customer">
                    <span><b>Maddie Fletcher</b> / Customer</span>
                    <p>“ Lorem ipsum dolor sit amet, consectetur elit, sed do eiusmod tempor incididunt ut labore et
                        dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
                        aliquip ex ea comodo conequat ”</p>
                </div> <!-- customer item -->
            </div>
            <div class="col-lg-6">
                <div class="customer-item">
                    <img src="/static/index/images/customer-1.png" alt="customer">
                    <span><b>Adam</b> / Designer</span>
                    <p>“ Lorem ipsum dolor sit amet, consectetur elit, sed do eiusmod tempor incididunt ut labore et
                        dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
                        aliquip ex ea comodo conequat ”</p>
                </div> <!-- customer item -->
            </div>
        </div> <!-- row -->
    </div> <!-- container -->
</div>

<!--====== CUSTOMER PART ENDS ======-->

<!--====== LATEST NEWS PART START ======-->

<section class="latest-news-area">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-lg-6">
                <div class="section-title text-center">
                    <h3 class="title">Latest News</h3>
                    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
                </div> <!-- section title -->
            </div>
        </div>
        <div class="row justify-content-center">
            <div class="col-lg-4 col-md-4 col-sm-8">
                <div class="latest-news-item mt-125">
                    <img src="/static/index/images/latest-news-1.jpg" alt="latest news">
                    <span>Food</span>
                    <a href="blog-details.html">
                        <h5 class="title">Cooking tips make cooking simple</h5>
                    </a>
                </div> <!-- latest news item -->
            </div>
            <div class="col-lg-4 col-md-4 col-sm-8">
                <div class="latest-news-item mt-30">
                    <img src="/static/index/images/latest-news-2.jpg" alt="latest news">
                    <span>Plant</span>
                    <a href="blog-details.html">
                        <h5 class="title">Plant Potted Decorative Green</h5>
                    </a>
                </div> <!-- latest news item -->
            </div>
            <div class="col-lg-4 col-md-4 col-sm-8">
                <div class="latest-news-item mt-125">
                    <img src="/static/index/images/latest-news-3.jpg" alt="latest news">
                    <span>Drinks</span>
                    <a href="blog-details.html">
                        <h5 class="title">Minimalist Dining Rooms</h5>
                    </a>
                </div> <!-- latest news item -->
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <div class="latest-news-link text-center">
                    <a href="blog-grid.html">View More</a>
                </div> <!-- latest news link -->
            </div>
        </div> <!-- row -->
    </div> <!-- container -->
</section>

<!--====== LATEST NEWS PART ENDS ======-->

<!--====== INSTAGRAM PART START ======-->

<div class="instagram-area">
    <div class="container-fluid pl-60 pr-60">
        <div class="row">
            <div class="col-lg-12">
                <div class="instagram-item d-flex">
                    <div class="single-instagram">
                        <img src="/static/index/images/instagram-1.jpg" alt="instagram">
                        <div class="instagram-overlay">
                            <a href="#"><i class="ion ion-logo-instagram"></i></a>
                        </div>
                    </div> <!-- single instagram -->
                    <div class="single-instagram">
                        <img src="/static/index/images/instagram-2.jpg" alt="instagram">
                        <div class="instagram-overlay">
                            <a href="#"><i class="ion ion-logo-instagram"></i></a>
                        </div>
                    </div> <!-- single instagram -->
                    <div class="single-instagram">
                        <img src="/static/index/images/instagram-3.jpg" alt="instagram">
                        <div class="instagram-overlay">
                            <a href="#"><i class="ion ion-logo-instagram"></i></a>
                        </div>
                    </div> <!-- single instagram -->
                    <div class="single-instagram d-none d-sm-inline-block">
                        <img src="/static/index/images/instagram-4.jpg" alt="instagram">
                        <div class="instagram-overlay">
                            <a href="#"><i class="ion ion-logo-instagram"></i></a>
                        </div>
                    </div> <!-- single instagram -->
                    <div class="single-instagram d-none d-md-inline-block">
                        <img src="/static/index/images/instagram-5.jpg" alt="instagram">
                        <div class="instagram-overlay">
                            <a href="#"><i class="ion ion-logo-instagram"></i></a>
                        </div>
                    </div> <!-- single instagram -->
                    <div class="single-instagram d-none d-md-inline-block">
                        <img src="/static/index/images/instagram-6.jpg" alt="instagram">
                        <div class="instagram-overlay">
                            <a href="#"><i class="ion ion-logo-instagram"></i></a>
                        </div>
                    </div> <!-- single instagram -->
                    <div class="single-instagram d-none d-lg-inline-block">
                        <img src="/static/index/images/instagram-7.jpg" alt="instagram">
                        <div class="instagram-overlay">
                            <a href="#"><i class="ion ion-logo-instagram"></i></a>
                        </div>
                    </div> <!-- single instagram -->
                    <div class="single-instagram d-none d-lg-inline-block">
                        <img src="/static/index/images/instagram-8.jpg" alt="instagram">
                        <div class="instagram-overlay">
                            <a href="#"><i class="ion ion-logo-instagram"></i></a>
                        </div>
                    </div> <!-- single instagram -->
                </div>
            </div>
        </div> <!-- row -->
    </div> <!-- container fluid -->
    <span># hafood</span>
</div>

<!--====== INSTAGRAM PART ENDS ======-->

<!--====== FOOTER PART START ======-->

<section class="footer-area gray-bg pb-90">
    <div class="container">
        <div class="row">
            <div class="col-lg-4 col-md-5">
                <div class="footer-item-1 mt-30">
                    <a href="index.html"><img src="/static/index/images/logo-2.png" alt="logo"></a>
                    <span>Copyright &copy; 2019.Company name All rights reserved.<a target="_blank"
                                                                                    href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></span>
                    <ul>
                        <li><a href="#">Quality policy</a></li>
                        <li><a href="#">Customer Policy </a></li>
                        <li><a href="#">About Us</a></li>
                    </ul>
                    <div class="footer-info">
                        <ul>
                            <li><i class="ion ion-md-pin"></i> 123 New Design Str, ABC Building, <br> Melbourne,
                                Australia
                            </li>
                            <li><i class="ion ion-ios-mail"></i>example@gmail.com</li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="col-lg-2 offset-lg-2 col-md-2 col-sm-4">
                <div class="footer-social mt-30">
                    <h5 class="title">Social Links</h5>
                    <ul>
                        <li><a href="">Facebook</a></li>
                        <li><a href="#">Twitter</a></li>
                        <li><a href="#">Instagram</a></li>
                        <li><a href="skype:live:taherul.islam_1">Skype</a></li>
                    </ul>
                </div>
            </div>
            <div class="col-lg-4 col-md-5 col-sm-8">
                <div class="footer-item-2 mt-30">
                    <h5 class="title">Newsletters</h5>
                    <form action="#">
                        <div class="input-box mt-25">
                            <input type="email" placeholder="Your email">
                        </div>
                        <div class="input-box mt-25">
                            <button class="main-btn">Submit <i class="ion ion-ios-send"></i></button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>

<!--====== FOOTER PART ENDS ======-->

<!--====== BACK TO TOP ======-->
<div class="back-to-top">
    <a href="">
        <i class="ion ion-md-arrow-up"></i>
    </a>
</div>
<!--====== BACK TO TOP ======-->


<!--====== jquery js ======-->
<script src="/static/index/js/vendor/modernizr-3.6.0.min.js"></script>
<script src="/static/index/js/vendor/jquery-1.12.4.min.js"></script>

<!--====== Bootstrap js ======-->
<script src="/static/index/js/bootstrap.min.js"></script>
<script src="/static/index/js/popper.min.js"></script>

<!--====== Slick js ======-->
<script src="/static/index/js/slick.min.js"></script>

<!--====== Isotope js ======-->
<script src="/static/index/js/isotope.pkgd.min.js"></script>

<!--====== Images Loaded js ======-->
<script src="/static/index/js/imagesloaded.pkgd.min.js"></script>

<!--====== Magnific Popup js ======-->
<script src="/static/index/js/jquery.magnific-popup.min.js"></script>

<!--====== Nice Select js ======-->
<script src="/static/index/js/jquery.nice-select.min.js"></script>

<!--====== Ajax Contact js ======-->
<script src="/static/index/js/ajax-contact.js"></script>

<!--====== Main js ======-->
<script src="/static/index/js/main.js"></script>

</body>

</html>

